<template>
	<van-sticky>
		<van-nav-bar :border='false' />
	</van-sticky>
	<van-row>
	  <van-col span="1" style="background-color: #FFB5C5;"></van-col>
	  <van-col span="3" style="display:flex; align-items:center; justify-content: center; background-color: #FFB5C5;">
		  <router-link to="mypage">
			<van-image round class="img" src="../static/img/myimg.png"/>	
		  </router-link>
	  </van-col>
	  <van-col span="17">
		  <search/>
	  </van-col>
	  <van-col span="3" style="display:flex; align-items:center; background-color: #FFB5C5;">
		  <router-link to="/publish">
			  <van-icon class='publish' name="add-o" color="white"/>
		  </router-link>
	  </van-col>
	</van-row>
	<tab />
</template>

<script setup>
	import {
		ref
	} from 'vue';
	import { onMounted } from 'vue';
	import search from '../../components/search/Search.vue'
	
	const value = ref('');
	
	const $emit = defineEmits(['change'])
	onMounted(()=>{
			 // 触发的事件， 传递的参数
	 	$emit("change", 0)
	 })

</script>

<style scoped>
	.img {
		vertical-align:middle;
		width: 35px;
		height: 35px;
	}
	
	.publish {
		font-size: 35px;
	}
</style>

<style>
	:root{
		--van-nav-bar-background-color: #FFB5C5;
		--van-nav-bar-height: 48px;
		}
</style>
